<template>
<el-dialog
  :title="this.tableName"
  :visible.sync="visible"
  width="80%"
  center
  @close="close">
    <v-form-render :form-json="formJson" :form-data="formData" :option-data="optionData" ref="vFormRef" class="cgs-vformRender"></v-form-render>
    <span slot="footer" class="dialog-footer">
        <el-button @click="ok">关闭</el-button>
    </span>
</el-dialog>
    
</template>

<script>
import { getShareRow, getShareWorksheetDetail  } from "@/api/worksheet.js"
export default {
    props: {
        visible: Boolean,
        worksheetId: String,
        rowId: String
    },
    data(){
        return {
            tableName: '',
            formJson: {},
            formData: {},
            optionData: {}
        }
    },
    computed:{
        worksheetId(){
            return this.$props.worksheetId
        },
        rowId(){
            return this.$props.rowId
        }
    },
    async mounted(){
        let result = await getShareWorksheetDetail(this.worksheetId)
        let formData = await getShareRow({worksheetId: this.worksheetId, rowId: this.rowId})
        if(result){
            this.tableName = result.name
            if('config' in result){
                let config = JSON.parse(result.config);
                this.$refs.vFormRef.setFormJson(config)
                this.$refs.vFormRef.setFormData(formData)
            }
        }
    },
    methods:{
        close(){
            this.$emit('close')
        },
        // addSuccess(){
        //     this.$emit('success')
        // },
        ok(){
            // this.addSuccess()
            this.close()
        }
    }
}
</script>

<style>
.appPage .el-form-item__label, .appPage  .el-dialog .el-form-item__label{
    padding-left: unset
}
.appPage .el-form-item__label{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.cgs-vformRender .el-dialog .mapPartition input{
    background-color: #fff !important;
}
.cgs-vformRender .el-dialog .el-dialog__footer{
    text-align: right;
}
.cgsVformPopupContent .cgsvjmap_row input.inputValueCol,.cgsVformPopupContent .cgsvjmap_row input.inputKeyCol {
  background-color: transparent !important;
}



.propertiesTable{
    border: 1px solid #EBEEF5 !important;
    background-color: #FFF !important;
    color: #606266 !important;
}
.propertiesTable .el-table tr>th.is-leaf{
  background-color: #FFF !important;
}
.el-table th,.el-table tr{
  background-color: #FFF !important;
  color: unset !important;
}
.el-table td{
  border-right: 1px solid #EBEEF5 !important;
  border-bottom: 1px solid #EBEEF5 !important;

}
.el-table__fixed-right-patch, .el-table--border::after {
    background-color: transparent;
}
.el-table td, .el-table__fixed-right-patch, .el-table--border th {
    border-bottom: 1px solid #EBEEF5;
    border-right: 1px solid #EBEEF5;
}
.propertiesTable .el-table--border::after{
  background-color: unset;
}
.propertiesTable .el-table__header-wrapper{
  border-bottom: 1px solid #EBEEF5;
}
.el-table th.is-leaf{
  border-bottom: 1px solid #EBEEF5;
}
.vjmapgis-ctrl-group input[type="checkbox"]:checked {
    background-color: rgba(0,0,0,0.15) !important;
}
.vjmapgis-ctrl-group input[type="checkbox"]{
    border-top: 1px solid #ddd;
    border-bottom: unset;
}
</style>